<template>
  <div style="background-color: #181818; padding: 0 10px; height: 500px">
    <h1 style="color: white;font-weight: bold;padding-left: 30px;padding-top: 15px">猜你喜欢</h1>
    <el-carousel height="400px" indicator-position="outside">
      <el-carousel-item>
        <div class="outer">
          <div class="middle">
            <img src="../../assets/sample1.webp" alt="s1">
            <n-h3 class="bookintro">书籍推荐｜经常看书与不看书能有什么区别，看完就知道了</n-h3>
            <p>在我们这个时代，少了《江南》，中国文学是不完整的。
              格非——作家，清华大学中文系教授。1964年生于江苏。代表作有长篇小说《江南》三部曲（2015年获第九届茅盾文学奖）、《望春风》，中短篇小说《迷舟》、《隐身衣》（2014年获鲁迅文学奖、老舍文学奖）等。作品被翻译成英、法、意、日、韩等多种文字。</p>
          </div>
          <div class="middle">
            <img src="../../assets/sample2.webp" alt="s2">
            <n-h3 class="bookintro">清华大学教授告诉你什么书最值得看！</n-h3>
            <p>光明森林club的“Top1好书计划”第四弹！光妹邀请了22家出版社的编辑老师们，来为大家推荐她们的最爱一本书！﻿</p>
          </div>
          <div class="middle">
            <img src="../../assets/sample3.webp" alt="s3">
            <n-h3 class="bookintro">s原价买书等于被割韭菜？？谈谈书籍市场的价格歧视！</n-h3>
            <p>最爱的书分享给最珍贵的小阔爱们❤️
              希望可以让大家感受到最简单的温暖和感动～
              感谢棒棒的你们又陪伴我度过了这一年！
              2023年，我们继续相爱！！！</p>
          </div>
        </div>
      </el-carousel-item>
      <el-carousel-item>
        <div class="outer">
          <div class="middle">
            <img src="../../assets/sample1.webp" alt="s1">
            <n-h3 class="bookintro">书籍推荐｜经常看书与不看书能有什么区别，看完就知道了</n-h3>
            <p>在我们这个时代，少了《江南》，中国文学是不完整的。
              格非——作家，清华大学中文系教授。1964年生于江苏。代表作有长篇小说《江南》三部曲（2015年获第九届茅盾文学奖）、《望春风》，中短篇小说《迷舟》、《隐身衣》（2014年获鲁迅文学奖、老舍文学奖）等。作品被翻译成英、法、意、日、韩等多种文字。</p>
          </div>
          <div class="middle">
            <img src="../../assets/sample2.webp" alt="s2">
            <n-h3 class="bookintro">清华大学教授告诉你什么书最值得看！</n-h3>
            <p>光明森林club的“Top1好书计划”第四弹！光妹邀请了22家出版社的编辑老师们，来为大家推荐她们的最爱一本书！﻿</p>
          </div>
          <div class="middle">
            <img src="../../assets/sample3.webp" alt="s3">
            <n-h3 class="bookintro">s原价买书等于被割韭菜？？谈谈书籍市场的价格歧视！</n-h3>
            <p>最爱的书分享给最珍贵的小阔爱们❤️
              希望可以让大家感受到最简单的温暖和感动～
              感谢棒棒的你们又陪伴我度过了这一年！
              2023年，我们继续相爱！！！</p>
          </div>
        </div>
      </el-carousel-item>
      <el-carousel-item>
        <div class="outer">
          <div class="middle">
            <img src="../../assets/sample1.webp" alt="s1">
            <n-h3 class="bookintro" style="color: #f2f2f2">书籍推荐｜经常看书与不看书能有什么区别，看完就知道了</n-h3>
            <p>在我们这个时代，少了《江南》，中国文学是不完整的。
              格非——作家，清华大学中文系教授。1964年生于江苏。代表作有长篇小说《江南》三部曲（2015年获第九届茅盾文学奖）、《望春风》，中短篇小说《迷舟》、《隐身衣》（2014年获鲁迅文学奖、老舍文学奖）等。作品被翻译成英、法、意、日、韩等多种文字。</p>
          </div>
          <div class="middle">
            <img src="../../assets/sample2.webp" alt="s2">
            <n-h3 class="bookintro">清华大学教授告诉你什么书最值得看！</n-h3>
            <p>光明森林club的“Top1好书计划”第四弹！光妹邀请了22家出版社的编辑老师们，来为大家推荐她们的最爱一本书！﻿</p>
          </div>
          <div class="middle">
            <img src="../../assets/sample3.webp" alt="s3">
            <n-h3 class="bookintro">s原价买书等于被割韭菜？？谈谈书籍市场的价格歧视！</n-h3>
            <p>最爱的书分享给最珍贵的小阔爱们❤️
              希望可以让大家感受到最简单的温暖和感动～
              感谢棒棒的你们又陪伴我度过了这一年！
              2023年，我们继续相爱！！！</p>
          </div>
        </div>
      </el-carousel-item>
      <el-carousel-item>
        <div class="outer">
          <div class="middle">
            <img src="../../assets/sample1.webp" alt="s1">
            <n-h3 class="bookintro">书籍推荐｜经常看书与不看书能有什么区别，看完就知道了</n-h3>

            <p>在我们这个时代，少了《江南》，中国文学是不完整的。
              格非——作家，清华大学中文系教授。1964年生于江苏。代表作有长篇小说《江南》三部曲（2015年获第九届茅盾文学奖）、《望春风》，中短篇小说《迷舟》、《隐身衣》（2014年获鲁迅文学奖、老舍文学奖）等。作品被翻译成英、法、意、日、韩等多种文字。</p>
          </div>
          <div class="middle">
            <img src="../../assets/sample2.webp" alt="s2">
            <n-h3 class="bookintro">清华大学教授告诉你什么书最值得看！</n-h3>
            <p>光明森林club的“Top1好书计划”第四弹！光妹邀请了22家出版社的编辑老师们，来为大家推荐她们的最爱一本书！﻿</p>
          </div>
          <div class="middle">
            <img src="../../assets/sample3.webp" alt="s3">
            <n-h3 class="bookintro">s原价买书等于被割韭菜？？谈谈书籍市场的价格歧视！</n-h3>
            <p>最爱的书分享给最珍贵的小阔爱们❤️
              希望可以让大家感受到最简单的温暖和感动～
              感谢棒棒的你们又陪伴我度过了这一年！
              2023年，我们继续相爱！！！</p>
          </div>
        </div>
      </el-carousel-item>
      <el-carousel-item>
        <div class="outer">
          <div class="middle">
            <img src="../../assets/sample1.webp" alt="s1">
            <n-h3 class="bookintro">书籍推荐｜经常看书与不看书能有什么区别，看完就知道了</n-h3>
            <p>在我们这个时代，少了《江南》，中国文学是不完整的。
              格非——作家，清华大学中文系教授。1964年生于江苏。代表作有长篇小说《江南》三部曲（2015年获第九届茅盾文学奖）、《望春风》，中短篇小说《迷舟》、《隐身衣》（2014年获鲁迅文学奖、老舍文学奖）等。作品被翻译成英、法、意、日、韩等多种文字。</p>
          </div>
          <div class="middle">
            <img src="../../assets/sample2.webp" alt="s2">
            <n-h3 class="bookintro">清华大学教授告诉你什么书最值得看！</n-h3>
            <p>光明森林club的“Top1好书计划”第四弹！光妹邀请了22家出版社的编辑老师们，来为大家推荐她们的最爱一本书！﻿</p>
          </div>
          <div class="middle">
            <img src="../../assets/sample3.webp" alt="s3">
            <n-h3 class="bookintro">s原价买书等于被割韭菜？？谈谈书籍市场的价格歧视！</n-h3>
            <p>最爱的书分享给最珍贵的小阔爱们❤️
              希望可以让大家感受到最简单的温暖和感动～
              感谢棒棒的你们又陪伴我度过了这一年！
              2023年，我们继续相爱！！！</p>
          </div>
        </div>
      </el-carousel-item>

    </el-carousel>
  </div>
</template>

<script setup>

</script>

<style scoped>
img {
  width: 100%;
}

p {
  padding: 3px 10px;
  color: white;
  display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 3;
	overflow: hidden;
}

n-h3 {
  color: #f2f2f2;
  line-height: 1.2;
}

.outer {
  display: -webkit-flex;
  display: flex;
  -webkit-justify-content: space-around;
  justify-content: space-around;
  padding: 15px 10px;
}

.middle {
  height: 380px;
  width: 370px;
  background-color: #282828;
}

.bookintro {
  color: #f2f2f2;
  font-weight: bold;
  padding: 0 10px;
  margin: 0;
}

</style>